<template>
	<view>






		<view class="p_40 ">
			<view class="inputtext q_y flex a-c">
				<input type="text" style="margin-left: 30rpx;" v-model="phone" class="f30" placeholder="请输入手机号" />
			</view>
		</view>

		<view v-if="sms_img_code==1" class="flex" style="padding-left: 40rpx;padding-right: 40rpx;">
			<view class="inputtext q_y flex a-c" style="flex:1">
				<input type="text" v-model="v_code" class="f30 ml2" placeholder="请输入图形验证码" />
			</view>
			<view @tap="get_imgCode" class="flex j-c ml2">
				<image class="b_y" style="width: 120px;height: 32px;" :src="code_img_a" mode=""></image>
			</view>
		</view>

		<view class="pt3 flex a-c" style="padding-left: 40rpx;padding-right: 40rpx;">
			<view class="inputtext q_y flex a-c" style="flex:1;border: solid 1rpx #DCDCDC">
				<input type="text" v-model="checknum" class="f30 ml2" placeholder="请输入手机验证码" />
			</view>
			<view @tap="getCheckNum">
				<view class="flex j-c bt b_y ml2 button_bg" style="width: 120px;height: 32px;">
					<text class="f28 j-c">{{!codetime?'获取验证码':codetime+' s'}}</text>
				</view>
			</view>
		</view>

		<view class="flex a-c j-c p_40 " style="padding-top: 80rpx;">
			<view @click="toLogin" class="flex a-c j-c by1 button_bg" style=" width: 600rpx;height: 80rpx;">
				<text class="q_y  f34">确认绑定</text>
			</view>
		</view>



	</view>
</template>

<script>
	// import moveVerify from "@/common/helang-moveVerify/helang-moveVerify.vue"



	export default {
		components: {

			// moveVerify


		},
		data() {
			return {
				windowHeight: 'height:600px',
				status: true,
				checknum: '',
				phone: '',
				flag: false,
				codetime: 0,
				resultData: {},
				password: '',
				nickname: '',
				account: '',
				tips: '',
				face: '',
				isty: false,
				v_univerifyStyle: {
					"fullScreen": "false", // 是否全屏显示，默认值： "false"
					"backgroundColor": "#ffffff", // 授权页面背景颜色，默认值：#ffffff
					"backgroundImage": "", // 全屏显示的背景图片，默认值："" （仅支持本地图片，只有全屏显示时支持）  
					"icon": {
						"path": "static/200.png" // 自定义显示在授权框中的logo，仅支持本地图片 默认显示App logo   
					},
					"phoneNum": {
						"color": "#202020" // 手机号文字颜色 默认值：#202020  
					},
					"slogan": {
						"color": "#BBBBBB" //  slogan 字体颜色 默认值：#BBBBBB  
					},
					"authButton": {
						"normalColor": "#FFD943", // 授权按钮正常状态背景颜色 默认值：#3479f5  
						"highlightColor": "#FFD943", // 授权按钮按下状态背景颜色 默认值：#2861c5（仅ios支持）  
						"disabledColor": "#FFD943", // 授权按钮不可点击时背景颜色 默认值：#73aaf5（仅ios支持）  
						"textColor": "#000000", // 授权按钮文字颜色 默认值：#ffffff  
						"title": "本机号码一键绑定", // 授权按钮文案 默认值：“本机号码一键登录”  
						"borderRadius": "24px" // 授权按钮圆角 默认值："24px" （按钮高度的一半）
					},
					"otherLoginButton": {
						"visible": "false", // 是否显示其他登录按钮，默认值：true  
						"normalColor": "", // 其他登录按钮正常状态背景颜色 默认值：透明 
						"highlightColor": "", // 其他登录按钮按下状态背景颜色 默认值：透明 
						"textColor": "#656565", // 其他登录按钮文字颜色 默认值：#656565  
						"title": "账号密码登陆", // 其他登录方式按钮文字 默认值：“其他登录方式”  
						"borderColor": "", //边框颜色 默认值：透明（仅iOS支持）  
						"borderRadius": "0px" // 其他登录按钮圆角 默认值："24px" （按钮高度的一半）
					},
					"privacyTerms": {
						"defaultCheckBoxState": "false", // 条款勾选框初始状态 默认值： true  
						"checkBoxSize": 20,
						"textColor": "#BBBBBB", // 文字颜色 默认值：#BBBBBB  
						"termsColor": "#ef8200", //  协议文字颜色 默认值： #5496E3  
						"prefix": "我已阅读并同意", // 条款前的文案 默认值：“我已阅读并同意”  
						"suffix": "并使用本机号码登录", // 条款后的文案 默认值：“并使用本机号码登录”  
						"privacyItems": [
							// 自定义协议条款，最大支持2个，需要同时设置url和title. 否则不生效  
							{
								"url": 'https://www.banmiquan.com/10/', // 点击跳转的协议详情页面  
								"title": "用户服务协议" // 协议名称  
							},
							{
								"url": 'https://www.banmiquan.com/11/', // 点击跳转的协议详情页面  
								"title": "隐私政策" // 协议名称  
							}

						]
					}

				},
				code_img_a: '',
				sms_img_code: 0,
				v_code: '',

			}
		},
		onReady() {
			uni.getSystemInfo({
				success: function(res) {
					// #ifdef APP-PLUS
					this.windowHeight = 'height:' + res.windowHeight - 120 + 'px';
					// #endif
				}
			});
		},
		onLoad(on) {
			this.account = on.account
			this.type = on.type;
			this.nickname = uni.getStorageSync('nickname');
			this.face = uni.getStorageSync('face');
			this.openid = on.openid
			if (!this.openid) {
				this.openid = '';
			}
			this.sex = on.sex
			this.unionid = on.unionid
			this.init();
		},
		methods: {
			init() {
				let RandomSixStr = ''
				for (let i = 0; i < 10; i++) {
					RandomSixStr += String(Math.floor(Math.random() * 10))
				}
 
				let requestParams = {
		 
					id: this.v_id
				};
				this.Http.post('/banmi.php/login/LoginInit',requestParams).then(ret => {

					this.find = ret.data.data.find;
					var settings = ret.data.data.settings;
					this.code_img_a = ret.data.code_img + '?id=' + RandomSixStr;
					this.code_img = ret.data.code_img;
					this.sms_img_code = ret.data.sms_img_code;



				})

			},
			get_imgCode() {
				let RandomSixStr = ''
				for (let i = 0; i < 10; i++) {
					RandomSixStr += String(Math.floor(Math.random() * 10))
				}
				this.code_img_a = this.code_img + '?id=' + RandomSixStr;
				this.v_id = RandomSixStr;

			},
			toLogin() {
				if (!this.account) {
					return
				}
				if (!this.isPhone()) {
					uni.showToast({
						title: '请输入正确的手机号码',
						icon: "none"
					});
					return;
				}

				if (!this.iscodetime) {
					uni.showToast({
						title: '请先获取验证码',
						icon: 'none'
					});
					return;
				}
				if (!this.checknum) {
					uni.showToast({
						title: '请输入验证码',
						icon: "none"
					});
					return;
				}
				uni.showLoading({
					title: '正在绑定中...'
				})
				var data = {
					account: this.account,
					tel: this.phone,
					smscode: this.checknum,
					openid: this.openid,
					type: this.type,
					encryptedData: ''
				}
				this.Banmikeji.User_app_account_tel(data).then(
					ret => {
						setTimeout(function() {
							uni.hideLoading();
						}, 500);
						if (ret.data.status == 200 || ret.data.status == 201) {
							uni.navigateBack()
						}
					})
			},
			login_ok() {
				setTimeout(function() {
					uni.$emit('banmi_login', {
						title: 1,
					});

					uni.switchTab({
						url: '/pages/index/index'
					})
				}, 2000);
			},
			toLogin1() {

				uni.showLoading({
					title: '获取中,请等待,如获取不到请换移动网络...'
				});
				var _this = this;


				uni.preLogin({
					provider: "univerify",
					success() {
						uni.hideLoading();
						const univerifyManager = uni.getUniverifyManager()

						// 订阅自定义按钮点击事件

						univerifyManager.login({
							provider: "univerify",
							univerifyStyle: _this.v_univerifyStyle,
							success(res) {
								_this.isface = true;
								uni.showLoading({
									title: '正在提交信息，请等待'
								});
								let loginRes = res.authResult;
								if (!_this.isdenglu) {
									_this.tellogin(loginRes.openid, loginRes.access_token);
								}

							},
							fail(fres) {





							}

						})

					}

				})



			},
			tellogin(openid, access_token) {
				let requestParams = {
					openid: openid,
					access_token: access_token,
					code: uni.getStorageSync('code'),
					nickname: this.nickname,
					face: this.face,
					openid1: this.openid,
					sex: this.sex,
					unionid: this.unionid,
				};

				$H.post('/index.php/index/Member/univerify1',requestParams).then(ret => {

					uni.hideLoading();
					this.isdenglu = true;
					uni.showToast({
						title: ret.msg,
						icon: 'none'
					});
					if (ret.status == 200 || ret.status == 201) {

						uni.showToast({
							title: ret.msg,
							icon: 'none'
						});
						uni.setStorage({
							key: 'token',
							data: ret.data.user.token
						});
						uni.setStorage({
							key: 'user_id',
							data: ret.data.user.uid
						});
						uni.setStorage({
							key: 'nickname',
							data: ret.data.user.nickname
						});
						uni.setStorage({
							key: 'face',
							data: ret.data.user.face
						});
						setTimeout(function() {
							uni.$emit('login', {
								title: 1
							});
							uni.closeAuthView();
							uni.redirectTo({
								url: '/pages/index/fenhong'
							})
						}, 2000);

					} else {
						this.isface = false;
						uni.showToast({
							title: ret.msg,
							icon: 'none'
						});
					}
				})
			},
			on_xieyi() {
				this.isty = !this.isty
			},
			verifyResult(res) {

				this.flag = res.flag;
				this.resultData = res;
				this.getCheckNum()
			},
			article_view(index) {
				uni.navigateTo({
					url: '../view/article_view?id=' + index
				});
			},
			// 验证手机号码
			isPhone() {
				let mPattern = /^1[23456789]\d{9}$/;
				return mPattern.test(this.phone);
			},
			// 获取验证码
			getCheckNum() {

				if (this.codetime > 0) {
					return;
				}
				// 验证手机号合法性
				if (!this.isPhone()) {
					uni.showToast({
						title: '请输入正确的手机号码',
						icon: "none"
					});
					return;
				}

				let requestParams = {
					phone: this.phone,
					account: this.account,
					v_code: this.v_code,
					id: this.v_id,
				};

				this.Http.post('/banmi.php/Sms/TelMessage', requestParams).then(ret => {
					uni.showToast({
						title: ret.msg,
						icon: 'none'
					});
					if (ret.status == 200) {

						this.codetime = 60;
						this.iscodetime = true;
						let timer = setInterval(() => {
							this.codetime--;
							if (this.codetime < 1) {
								clearInterval(timer);
								this.codetime = 0;
							}
						}, 1000);
					} else {
						uni.showToast({
							title: ret.msg,
							icon: 'none'
						});
					}
				})


			},



		}
	}
</script>

<style scoped>
	.inputtext {
		border: solid 2rpx #EEEEEE;
		height: 80rpx !important;
	}

	.bt {
		width: 180rpx;
		padding-top: 15rpx;
		padding-bottom: 15rpx;

	}

	.qt_img {
		height: 80rpx;
		width: 80rpx;
		margin-right: 20rpx;
	}
</style>